<template>
  <el-row class="form-block">
    <el-row class="form-row-block">
      <el-col :span="2">组描述：</el-col>
      <el-col :span="22">
        <el-input v-model="item.comment" size="mini"></el-input>
      </el-col>
    </el-row>
    <el-row class="form-row-block">
      <el-col :span="2">组成员：</el-col>
      <el-col :span="22">
        <el-select v-model="value" size="mini" multiple filterable style="width: 100%;">
          <el-option v-for="(name, index) in users" :label="name" :value="name"></el-option>
        </el-select>
      </el-col>
    </el-row>
    <el-row>
      <el-button size="mini" icon="el-icon-check" @click="submit">提交</el-button>
    </el-row>
  </el-row>
</template>

<script>
  import access from '../api/access.js'
  export default {
    name: "group",
    props: {
      item: {
        type: Object,
        require: true
      },
      users: {
        type: Array,
        required: true
      }
    },
    computed: {
      value: {
        get: function() {
          return this.item.value ? this.item.value.split(',') : null
        },
        set: function(v) {
          this.item.value = v.join(',')
        }
      }
    },
    methods: {
      submit: function() {
        access.updateGroups(this.item).then(res => {
          if (!res.success) {
            this.$message.warning(res.message || '提交失败');
          }
        })
      }
    }
  }
</script>

<style>
</style>
